<template>
<el-container class="conbox">
  <el-aside width="auto" height="auto">
    <AsiderBar/>
  </el-aside>
  <el-container>
    <el-header> <HeaderBar/></el-header>
    <el-main style=""> <AppMain/></el-main>
  </el-container>
</el-container>
</template>
<script>
import AsiderBar from '../components/layout/AsiderBar.vue'
import HeaderBar from '../components/layout/HeaderBar.vue'
import AppMain from '../components/layout/AppMain.vue'
export default {
name:'Main',
components:{
   AsiderBar,
       HeaderBar,
           AppMain
},

data() {
      return{
        
      }
    }
}
</script>
<style lang="less" scoped>
.conbox{
  width: 100%;
  /* height: 1000px; */
}
 .el-header{
    background-color: hsl(215, 26%, 91%);
    color: #333;
    line-height: 60px;
  }
  .el-aside {
   
    color: #fff;
    line-height: 200px;
      text-align: left;
   background-color:#545c64;
    color: rgb(233, 33, 33);
   overflow: hidden;
  
  
  }
  
  .el-main {
    background-color: #E9EEF3;
    color: #333;
    line-height: 30px;
    text-align: left;
  }
  .el-aside {
    line-height: 320px;
  }
</style>